<template>
<div class="dy-main EAccountRechange">
  <div class="dy-header">
    <x-header :right-options="{showMore: false}"  :left-options="{backText: '',preventGoBack: true}" @on-click-more="showMenus = true" @on-click-back="back">E账户转入转出</x-header>
  </div>
  <div class="dy-body">
    <div class="sticky">
      <zx-button type="tab" :data="['转入', '提现']" @on-click="tabClick"></zx-button>
      <!-- <sticky
        scroll-box="vux_view_box_body"
        ref="sticky"
        :offset="46"
        :check-sticky-support="false"
        >
        <tab :line-width="1">
          <tab-item selected @click.native="tozhuanru">转入</tab-item>
          <tab-item @click.native="tozhuanchu">转出</tab-item>
        </tab>
      </sticky> -->
    </div>
    <div class="zhuanru" v-if="!InOut">
      <div class="groupInput">
        <group title="">
          <cell title="转入账户" :value="eaccountData.IDNo"></cell>
          <popup-picker popup-title="选择银行卡" :title="title1" :data="eaccountData.arrays" v-model="value_code" @on-show="onShow" @on-hide="onHide" @on-change="onChange" placeholder=""></popup-picker>
          <x-input title="转入金额" placeholder="请输入转入金额" v-model="testForm.money1.val" text-align="right" label-width="1.8rem"></x-input>
        </group>
      </div>
      <div class="surebtn">
        <x-button class="subBtn"  @click.native="toEAccountChangeOverResult" type="primary" action-type="button">{{buttonTxt}}</x-button>
      </div>
    </div>
    <div class="zhuanchu" v-if="InOut">
      <div class="groupInput">
        <group title="">
          <cell title="转出账户" :value="eaccountData.IDNo"></cell>
          <popup-picker popup-title="选择银行卡" :title="title1" :data="eaccountData.arrays" v-model="value_code" @on-show="onShow" @on-hide="onHide" @on-change="onChange" placeholder=""></popup-picker>
          <x-input title="提现金额" placeholder="请输入提现金额" v-model="testForm.money1.val" text-align="right" label-width="1.8rem"></x-input>
        </group>
      </div>
      <div class="surebtn">
        <x-button class="subBtn"  @click.native="toEAccountRollOut" type="primary" action-type="button">{{buttonTxt1}}</x-button>
      </div>
    </div>
     <toast v-model="showPositionValue" type="text" width="6rem" :time="800" is-show-mask :text="errormsg" position="middle">{{ errormsg }}</toast>
  </div>
</div>
</template>

<script>
import { Tab, TabItem, Sticky } from 'vux'
export default {
  components: {
    Tab,
    TabItem,
    Sticky
  },
  data () {
    return {
      errormsg: '',
      showPositionValue: false,
      title1: '选择银行卡',
      value_code: [],
      eaccountData: {
        IDNo: '',
        arrays: []
      },
      testForm: {
        code: {val: '', type: [{typeName: 'minLen', typeVal: '2', msg: '账号不能小于2'}]},
        money1: {val: '', type: [{typeName: 'minLen', typeVal: '2', msg: '金额不能小于2'}]}
      },
      InOut: 0, // 转入 1， 提现 0
      buttonTxt: '充值',
      buttonTxt1: '提现',
      maskValue: '123456'
    }
  },
  watch: {
    'value_code': function (val) {
      this.testForm.code.val = val[0]
    }
  },
  methods: {
    back () {
      this.$publicFun.goBack(this)
    },
    tabClick (val) {
      this.InOut = val
    },
    onShow () {

    },
    onHide (type) {},
    onChange (val) {},
    toEAccountChangeOverResult: function () {
      for (let key in this.testForm) {
        let lObj = this.testForm[key]
        let lRes = this.$publicFun.formCheck(lObj)
        if (!lRes.isOK) {
          this.errormsg = lRes.msg
          this.showPositionValue = true
          return false
        }
      }
      this.$router.push({name: 'EAccountChangeOverResult', query: {'money': this.testForm.money1.val, 'cardNo': this.testForm.code.val}})
    },
    toEAccountRollOut: function () {
      for (let key in this.testForm) {
        let lObj = this.testForm[key]
        let lRes = this.$publicFun.formCheck(lObj)
        if (!lRes.isOK) {
          this.errormsg = lRes.msg
          this.showPositionValue = true
          return false
        }
      }
      this.$router.push({name: 'EAccountRollOut', query: {'money1': this.testForm.money1.val, 'cardNo1': this.testForm.code.val}})
    },
    tozhuanchu: function () {
      this.zhuanchu = true
      this.zhuanru = false
    },
    tozhuanru: function () {
      this.zhuanchu = false
      this.zhuanru = true
    },
    getData () {
      this.$bridge.callhandler('nativeRequest',
        JSON.stringify({
          'requstSource': 'internetRequest',
          'url': 'mstep.do?act=business',
          'params': {'method_Name': 'EAccountTransfer', 'basic_Data': JSON.stringify({'cardNo': '', 'tranAmt': '2001', 'acctNo': '4225876765456787987', 'tranFlag': ''})}
        }),
        (response) => {
          // alert('返回' + JSON.stringify(response))
          // response是响应数据
          this.eaccountData = response
          response = JSON.parse(response)
          if (response.status === 0 || response.status === '0') {
            // this.eaccountData.IDNo = response.data.data[0].IDNo
            // this.eaccountData.arrays.push(response.data.data[0].arrays)
          } else {
            console.log('fail')
          }
        })
    }
  },
  created () {
    this.getData()
  }
}
</script>
<style lang="less">
.EAccountRechange{
  .sticky{
    height: .44rem;
    width: 4rem;
    margin: .2rem auto;
  }
  .groupInput {
    background: #fff;
    margin-top:.2rem;
  }
  .surebtn {
    width:6.9rem;
    margin-left:.3rem;
    margin-top:.6rem;
  }
}
</style>
